/*--------------------------------------------------------------------------------------------------

   BUTTON DEFINITIONS

   Edit below at your own risk, everything done here is for a reason for cross browser
   compatibility so that the buttons will appear identical in the tested browsers.

   Tested on: IE6 IE7 FF(PC/MAC) Safari SafariMobile Opera(PC/MAC)

--------------------------------------------------------------------------------------------------*/

button,
a.button,
a.button:link,
a.button:visited {
    /*
        Strip down the button and link elements to a base we can work with.
    */
    padding: 0 0 0 0;
    margin: 0 5px 0 0;
    border: none;
    display: block;
    float: left;
    cursor: pointer;
    text-decoration: none;
    outline: none;
    white-space: nowrap;
    overflow: visible;
}

* html a.button,
* html a.button:link,
* html a.button:visited {
    /*
        IE6 fix to make link fit text.
    */
    width: 1%;
}

button, x:-moz-any-link {
    /*
        FF fix to make button spacing even across browsers.
    */
    margin: 0 0 0 0;
}

button::-moz-focus-inner {
    border: 0;
    padding: 0;
}

*:first-child+html button {
    /*
        Reset IE7 back to what it was for previous fix.
    */
    margin: 0 5px 0 0;
}

button span,
a.button span,
a.button:link span,
a.button:visited span {
    /*
        Set the span tags to display: block, as they will work our background-image magic.
    */
    display: block;
}

/*--------------------------------------------------------------------------------------------------

   CUSTOMIZATIONS

   Edit below to change the look and feel of the buttons and even add more classes for
   different looks and feels.

--------------------------------------------------------------------------------------------------*/

button,
a.button,
a.button:link,
a.button:visited {
    /*
        HEIGHT - Total height of button.
    */
    height: 32px;
    margin: 0 5px 0 0;

    /*
        NOTE - You must define the font here otherwise your buttons and links could end up diffrent.
    */
    font-family: Arial, sans-serif;
    font-weight: bold;
    font-size: 13px;
    letter-spacing: 0.075em;
    color: #eef;
    text-shadow: #336 0px -1px 1px;
}
button.negative,
a.negative,
a.negative:link,
a.negative:active {
    text-shadow: #633 0px -1px 1px;
}
button.positive,
a.positive,
a.positive:link,
a.positive:active {
    text-shadow: #363 0px -1px 1px;
}

button span,
a.button span,
a.button:link span,
a.button:visited span {
    /*
        Right side padding for button (default).
    */
    margin-left: 5px;
    padding: 0 14px 0 0;

    /*
        SPAN HEIGHT - This should be 2px smaller than the height set on the button (see HEIGHT).
    */
    height: 32px;

    /*
        We define our background top left and use the 'Sliding Doors' Technique for some fast loading buttons.
    */
    background: url(/images/newsite/buttons/generic.png) right 0;
}
button.negative span,
a.negative span,
a.negative:link span,
a.negative:visited span {
    background: url(/images/newsite/buttons/negative.png) right 0;
}
button.positive span,
a.positive span,
a.positive:link span,
a.positive:visited span {
    background: url(/images/newsite/buttons/positive.png) right 0;
}

button span span,
a.button span span,
a.button:link span span,
a.button:visited span span {
    /*
        Left side padding for button (default).
    */
    margin-left: -5px;
    padding: 0 0 0 13px;

    /*
        SPAN HEIGHT - This should be 1px smaller than the height set on the button (see HEIGHT).
    */
    height: 32px;

    /*
        SPAN LINE-HEIGHT - This should be 1px smaller than the height set on the button (see HEIGHT) and will
                            center the text vertcailly.
    */
    line-height: 32px;

    /*
        We define our background top left and use the 'Sliding Doors' Technique for some fast loading buttons.
    */
    background: url(/images/newsite/buttons/generic.png) left 0;
}
button.negative span span,
a.negative span span,
a.negative:link span span,
a.negative:visited span span {
    background: url(/images/newsite/buttons/negative.png) left 0;
}
button.positive span span,
a.positive span span,
a.positive:link span span,
a.positive:visited span span {
    background: url(/images/newsite/buttons/positive.png) left 0;
}

button:hover span,
a.button:hover span {
    /*
        Using the 'Sliding Doors' Technique we 'slide' the new button state into view.
    */
    background-position: right -32px;
}

button:active span,
a:active:active span,
    /*
        'button_active' is the class used by SimplyButtons.js to create the button states in IE.
    */
button.button_active span,
a.button_active:active span {
    /*
        Using the 'Sliding Doors' Technique we 'slide' the new button state into view.
    */
    background-position: right -32px;
}

button:hover span span,
a.button:hover span span {
    text-decoration: none;
    color: #fff;

    /*
        Using the 'Sliding Doors' Technique we 'slide' the new button state into view.
    */
    background-position: left -32px;
}

button:active span span,
a:active:active span span,
    /*
        'button_active' is the class used by SimplyButtons.js to create the button states in IE.
    */
button.button_active span span,
a.button_active:active span span {
    /*
        Using the 'Sliding Doors' Technique we 'slide' the new button state into view.
    */
    background-position: left -32px;
}

/*** Fix jQuery UI buttons ***/
.ui-button .ui-button-text {
    text-shadow: #fff 0 0 0;
    background: none;
    line-height: 13px;
}